<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>
		<style type="text/css">
			div {
				width: 300px;
				height: 300px;
				background: pink;
			}
		</style>
	</head>

	<body>
		<div>

		</div>
		
	</body>
	<script type="text/javascript">
		//		$('div').click(function(){
		//			console.log('鼠标被点击了')
		//		})
		//      $('div').mousedown(function(){
		//      	console.log('当鼠标按下的时候，被调用的事件')
		//      })
		//		$('div').mouseup(function(){
		//			console.log('当鼠标抬起的时候，被调用的事件')
		//		})
		//		$('div').mousemove(function() {
		//			console.log('当鼠标移动的时候，被调用的事件')
		//		})
		//		$('div').mouseover(function() {
		//          console.log('当鼠标移动到控件(标签)的上方，被调用的事件')
		//		})
		$('div').mouseenter(function() {
			console.log('当鼠标进入控件的时候，会被调用')
		})
		$('div').mouseleave(function() {
			console.log('当鼠标离开控件的时候，会被调用')
		})
	</script>

</html>